import 'package:flutter/material.dart';
import 'package:flutter_douban/config/app_colors.dart';
import 'package:flutter_douban/model/recipe_big_model.dart';
import 'package:flutter_douban/tool_views/cached_network_Image.dart';

class CoolDetailNavHeader extends StatefulWidget {
  final RecipeBigModel model;
  final double? offset;
  final double? appBarAlpha;

  const CoolDetailNavHeader(
      {Key? key, required this.model, this.offset, this.appBarAlpha})
      : super(key: key);

  @override
  _CoolDetailNavHeaderState createState() => _CoolDetailNavHeaderState();
}

class _CoolDetailNavHeaderState extends State<CoolDetailNavHeader> {
  @override
  Widget build(BuildContext context) {
    return Opacity(
      opacity: widget.offset! > 0 ? widget.appBarAlpha! : 1.0,
      child: Stack(
        children: [
          Container(
            padding: EdgeInsets.only(left: 20, right: 10, top: 15),
            height: kToolbarHeight + MediaQuery.of(context).padding.top,
            width: MediaQuery.of(context).size.width,
            color: widget.offset! > 0 ? Colors.white : Colors.transparent,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                _iconWidget(),
                _shareWidget(),
              ],
            ),
          ),
          Positioned(
              bottom: 0,
              child: Container(
                width: MediaQuery.of(context).size.width,
                height: 1,
                color: widget.offset! > 0 ? Colors.black12 : Colors.transparent,
              ))
        ],
      ),
    );
  }

  /// 头像 关注按钮
  Widget _iconWidget() {
    List<Widget> widgetList = [];
    if (widget.offset! >
        int.parse(widget.model.ph!) *
                MediaQuery.of(context).size.width /
                int.parse(widget.model.pw!) +
            60) {
      widgetList = [
        InkWell(
          child: Image.asset(
            'assets/images/common/tab_icon_back.png',
            width: 20,
            height: 20,
            color: widget.offset! > 0 ? Colors.black : Colors.white,
          ),
          onTap: () {
            Navigator.pop(context);
          },
        ),
        SizedBox(
          width: 20,
        ),
        IconImage(
          width: 32,
          height: 32,
          url: widget.model.user!.avatar_medium!,
          borderWidth: 1,
          borderColor: Colors.transparent,
          radius: 15,
        ),
        SizedBox(
          width: 20,
        ),
        SizedBox(
          width: 70,
          height: 28,
          child: FlatButton(
            onPressed: () => print(''),
            child: Text(
              '关注',
              style: TextStyle(
                color: Colors.black,
                fontSize: 12,
                fontWeight: FontWeight.bold,
              ),
            ),
            color: AppColors.yellow,
            shape: RoundedRectangleBorder(
                side: BorderSide(
                  color: AppColors.yellow,
                  width: 0.5,
                ),
                borderRadius: BorderRadius.circular(15)),
          ),
        )
      ];
    } else {
      widgetList = [
        InkWell(
          child: Image.asset(
            'assets/images/common/tab_icon_back.png',
            width: 20,
            height: 20,
            color: widget.offset! > 0 ? Colors.black : Colors.white,
          ),
          onTap: () {
            Navigator.pop(context);
          },
        ),
      ];
    }
    return Row(
      children: widgetList,
    );
  }

  Widget _shareWidget() {
    return Row(
      children: [
        Image.asset(
          'assets/images/common/navi_item_share_moments.png',
          width: 24,
          height: 24,
          color: widget.offset! > 0 ? Colors.black : Colors.white,
        ),
        SizedBox(
          width: 25,
        ),
        Image.asset(
          'assets/images/common/navi_item_share_contact.png',
          width: 24,
          height: 24,
          color: widget.offset! > 0 ? Colors.black : Colors.white,
        ),
        SizedBox(
          width: 25,
        ),
        Image.asset(
          'assets/images/common/navi_item_more.png',
          width: 24,
          height: 24,
          color: widget.offset! > 0 ? Colors.black : Colors.white,
        ),
      ],
    );
  }
}
